<style scoped lang="less">
  .home{
    width: 100vw;
    overflow-x: hidden;
  }
</style>
<template>
  <div class="home">
    <div class="right-item" v-for="(item,key) in homeData"
         :key="key+''">
      <template v-if="item.value===types.search">
        <QSearch
          :placeholder="item.data.placeholder"
          :sitename="item.data.sitename">
        </QSearch>
      </template>
      <template v-else-if="item.value===types.banner">
        <QBanner :list="item.data.list"></QBanner>
      </template>
      <template v-else-if="item.value===types.category">
        <QCategory :list="item.data.list"></QCategory>
      </template>
      <template v-else-if="item.value===types.subject">
        <QSubject :subject="item.data"></QSubject>
      </template>

    </div>
  </div>
</template>

<script>
  import {getSiteView} from '@/api/site'
  import QSearch from '../components/site/search'
  import QBanner from '../components/site/banner'
  import QCategory from '../components/site/category'
  import QSubject from '../components/site/subject'


  export default {
    name: 'home',
    components: {
      QSearch, QBanner, QCategory, QSubject
    },
    data() {
      return {
        types: {
          search: 0,//搜索
          banner: 1,//轮播
          category: 2,//分类
          subject: 3,//专题
        },
        homeData: [],
        imgList: [{name: "t1/20191205/5de8b3cc7e373.png"}]
      };
    },
    created() {
      let vm = this;
      getSiteView().then(rep => {
        vm.homeData = JSON.parse(rep.data.data.view_config)
      })
    }
  }
</script>
